<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>17商城</title>
    <link type="text/css" href="css/css.css" rel="stylesheet"/>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/js.js"></script>
    <script src="js/wb.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        $(function () {
            $("#kinMaxShow").kinMaxShow();
        })
    </script>
    <script type="text/javascript">
        $(function () {
            $.get("${pageContext.request.contextPath}/goodsType", data => {
                let str = ""
                for (let i = 0; i < data.length; i++) {
                    /*商品首页跳转到分类页*/
                    str += `<li><a href='${pageContext.request.contextPath}/goods?tid=` + data[i].tid + `'>` + data[i].tname + `</a></li>`
                }
                $("#t001").html(str)
                $("#t002").html(str)
            }, "json")

            //首页展示数据，共4F，每F4件商品
            $.get("${pageContext.request.contextPath}/indexGoods", data => {
                console.log(data.list1)
                let gli = "";
                for (let i = 0; i < data.list1.length; i++) {
                    gli += `<dl>
                            <dt><a href="${pageContext.request.contextPath}/goodsInfo?gid=` + data.list1[i].gid + `"><img src="${pageContext.request.contextPath}/gimages/`+data.list1[i].g_img+`" width="132" height="129"/></a></dt>
                            <dd>` + data.list1[i].gname + `</dd>
                            <dd class="cheng">￥` + data.list1[i].price + `</dd>
                        </dl>`
                }
                $("#g1f").html(gli)

                gli = "";
                for (let i = 0; i < data.list2.length; i++) {
                    gli += `<dl>
                            <dt><a href="${pageContext.request.contextPath}/goodsInfo?gid=` + data.list2[i].gid + `"><img src="${pageContext.request.contextPath}/gimages/`+data.list2[i].g_img+`" width="132" height="129"/></a></dt>
                            <dd>` + data.list2[i].gname + `</dd>
                            <dd class="cheng">￥` + data.list2[i].price + `</dd>
                        </dl>`
                }
                $("#g2f").html(gli)


                gli = "";
                for (let i = 0; i < data.list3.length; i++) {
                    gli += `<dl>
                            <dt><a href="${pageContext.request.contextPath}/goodsInfo?gid=` + data.list3[i].gid + `"><img src="${pageContext.request.contextPath}/gimages/`+data.list3[i].g_img+`" width="132" height="129"/></a></dt>
                            <dd>` + data.list3[i].gname + `</dd>
                            <dd class="cheng">￥` + data.list3[i].price + `</dd>
                        </dl>`
                }
                $("#g3f").html(gli)

                gli = "";
                for (let i = 0; i < data.list4.length; i++) {
                    gli += `<dl>
                            <dt><a href="${pageContext.request.contextPath}/goodsInfo?gid=` + data.list4[i].gid + `"><img src="${pageContext.request.contextPath}/gimages/`+data.list4[i].g_img+`" width="132" height="129"/></a></dt>
                            <dd>` + data.list4[i].gname + `</dd>
                            <dd class="cheng">￥` + data.list4[i].price + `</dd>
                        </dl>`
                }
                $("#g4f").html(gli)
            }, "json")
        })
    </script>

</head>

<body>
<div class="mianCont">
    <div class="top">
        <span>您好！欢迎来到17商城 请&nbsp;<a href="login.html">[登录]</a>&nbsp;<a href="reg.html">[注册]</a></span>
        <span class="topRight">
    <a href="vip.jsp">我的17</a>&nbsp;|
    <a href="order.jsp">我的订单</a>&nbsp;|
    <a href="login.jsp">会员中心</a>&nbsp;|
    <a href="contact.jsp">联系我们</a>
   </span>
    </div><!--top/-->
    <div class="lsg">
        <h1 class="logo"><a href="index.jsp"><img src="images/logo.png" width="217" height="90"/></a></h1>
        <form action="${pageContext.request.contextPath}/goodsSearch" method="get" class="subBox">
            <div class="subBoxDiv">
                <input type="text" class="subLeft" name="gname"/>
                <input type="image" src="images/subimg.png" width="63" height="34" class="sub"/>
            </div><!--subBoxDiv/-->
        </form><!--subBox/-->
        <div class="gouwuche">
            <div class="gouCar">
                <img src="images/gouimg.png" width="19" height="20" style="position:relative;top:6px;"/>&nbsp;|&nbsp;
                <strong class="red">0</strong>&nbsp;件&nbsp;|
                <strong class="red">￥ 0.00</strong>
                <a href="order.html">去结算</a> <img src="images/youjian.jpg" width="5" height="8"/>
            </div><!--gouCar/-->
            <div class="myChunlv">
                <a href="vip.html"><img src="images/mychunlv.jpg" width="112" height="34"/></a>
            </div><!--myChunlv/-->
        </div><!--gouwuche/-->
    </div><!--lsg/-->
    <div class="pnt">
        <div class="pntLeft">
            <h2 class="Title">所有商品分类</h2>
            <ul class="InPorNav">
                <div id="t001"></div>
            </ul><!--InPorNav/-->
        </div><!--pntLeft/-->
        <div class="pntRight">
            <ul class="nav">
                <li class="navCur"><a href="index.jsp">商城首页</a></li>
                <div id="t002"></div>
                <div class="clears"></div>
                <div class="phone">TEL：199个9</div>
            </ul><!--nav/-->
            <div class="banner">
                <div id="kinMaxShow">
                    <div>
                        <a href="#"><img src="images/ban1.jpg" height="360"/></a>
                    </div>
                    <div>
                        <a href="#"><img src="images/ban2.jpg" height="360"/></a>
                    </div>
                    <div>
                        <a href="#"><img src="images/ban3.jpg" height="360"/></a>
                    </div>
                    <div>
                        <a href="#"><img src="images/ban4.jpg" height="360"/></a>
                    </div>
                    <div>
                        <a href="#"><img src="images/ban5.jpg" height="360"/></a>
                    </div>
                </div><!--kinMaxShow/-->
            </div><!--banner/-->
        </div><!--pntRight/-->
        <div class="clears"></div>
    </div><!--pnt/-->

    <div class="hengfu">
        <img src="images/henge1.jpg" width="979" height="170"/>
    </div><!--hengfu/-->
    <div class="floor" id="floor1">
        <h3 class="floorTitle">
            1F&nbsp;&nbsp;&nbsp;&nbsp;宠物食品
            <a href="product.jsp" class="more">更多 &gt;</a>
        </h3>
        <div class="floorBox">
            <div class="floorLeft">
                <div class="flImg"><img src="images/flListimg.jpg" width="198" height="290"/></div>
            </div><!--floorLeft/-->
            <div class="floorRight">
                <div class="frProList">
                    <div id="g1f">

                    </div>
                    <div class="clears"></div>
                </div><!--frProList-->
            </div><!--floorRight/-->
            <div class="clears"></div>
        </div><!--floorBox/-->
    </div><!--floor/-->
    <div class="hengfu">
        <img src="images/henge2.jpg" width="978" height="170"/>
    </div><!--hengfu/-->
    <div class="floor" id="floor2">
        <h3 class="floorTitle">
            2F&nbsp;&nbsp;&nbsp;&nbsp;宠物护理
            <a href="product.jsp" class="more">更多 &gt;</a>
        </h3>
        <div class="floorBox">
            <div class="floorLeft">
                <div class="flImg"><img src="images/rdPro2.jpg" width="198" height="290"/></div>
            </div><!--floorLeft/-->
            <div class="floorRight">
                <div class="frProList">
                    <div id="g2f">
                    </div>
                    <div class="clears"></div>
                </div><!--frProList-->

            </div><!--floorRight/-->
            <div class="clears"></div>
        </div><!--floorBox/-->
    </div><!--floor/-->
    <div class="floor" id="floor3">
        <h3 class="floorTitle">
            3F&nbsp;&nbsp;&nbsp;&nbsp;宠物牵引
            <a href="product.jsp" class="more">更多 &gt;</a>
        </h3>
        <div class="floorBox">
            <div class="floorLeft">
                <div class="flImg"><img src="images/rdPro3.jpg" width="198" height="290"/></div>
            </div><!--floorLeft/-->
            <div class="floorRight">
                <div class="frProList">
                    <div id="g3f"></div>
                    <div class="clears"></div>
                </div><!--frProList-->
            </div><!--floorRight/-->
            <div class="clears"></div>
        </div><!--floorBox/-->
    </div><!--floor/-->
    <div class="hengfu">
        <img src="images/henge1.jpg" width="978" height="170"/>
    </div><!--hengfu/-->

    <div class="floor" id="floor4">
        <h3 class="floorTitle">
            4F&nbsp;&nbsp;&nbsp;&nbsp;宠物玩具
            <a href="product.jsp" class="more">更多 &gt;</a>
        </h3>
        <div class="floorBox">
            <div class="floorLeft">
                <div class="flImg"><img src="images/rdPro1.jpg" width="198" height="290"/></div>
            </div><!--floorLeft/-->
            <div class="floorRight">
                <div class="frProList">
                    <div id="g4f"></div>
                    <div class="clears"></div>
                </div><!--frProList-->
            </div><!--floorRight/-->
            <div class="clears"></div>
        </div><!--floorBox/-->
    </div><!--floor/-->
    <div class="hengfu">
        <img src="images/henge2.jpg" width="978" height="170"/>
    </div><!--hengfu/-->

    <div class="inHelp">
        <div class="inHLeft">
            <h4>帮助中心</h4>
            <ul class="inHeList">
                <li><a href="help.html">购物指南</a></li>
                <li><a href="help.html">支付方式</a></li>
                <li><a href="help.html">售后服务</a></li>
                <li><a href="about.html">企业简介</a></li>
                <div class="clears"></div>
            </ul><!--inHeList/-->
        </div><!--inHLeft/-->
        <div class="inHLeft">
            <h4>会员服务</h4>
            <ul class="inHeList">
                <li><a href="reg.html">会员注册</a></li>
                <li><a href="login.html">会员登录</a></li>
                <li><a href="order.html">购物车</a></li>
                <li><a href="order.html">我的订单</a></li>
                <div class="clears"></div>
            </ul><!--inHeList/-->
        </div><!--inHLeft/-->
        <div class="inHRight">
            <h4>全国统一免费服务热线</h4>
            <div class="telBox">400-0000-0000</div>
            <div class="weibo">
                <wb:follow-button uid="2991975565" type="red_1" width="67" height="24"></wb:follow-button>
            </div>
        </div><!--inHRight/-->
        <div class="clears"></div>
    </div><!--inHelp/-->
    <div class="footer">
        <p>
            <a href="#">进入17官网</a>&nbsp;|&nbsp;
            <a href="index.html">商城首页</a>&nbsp;|&nbsp;
            <a href="product.html">促销中心</a>&nbsp;|&nbsp;
            <a href="order.html">我的订单</a>&nbsp;|&nbsp;
            <a href="new.html">新闻动态</a>&nbsp;|&nbsp;
            <a href="login.html">会员中心</a>&nbsp;|&nbsp;
            <a href="help.htmll">帮助中心</a>
        </p>
        <p>
            版权所有：上海17实业有限公司 版权所有 Copyright 2010-2015 沪ICP备00000000号 <a href="http://www.cssmoban.com/" target="_blank">模板之家</a>
        </p>
    </div><!--footer/-->
</div><!--mianCont/-->
<a href="#" class="backTop">&nbsp;</a>
<style>
    .copyrights {
        text-indent: -9999px;
        height: 0;
        line-height: 0;
        font-size: 0;
        overflow: hidden;
    }
</style>
<div class="copyrights">
    Collect from <a href="http://www.cssmoban.com/" title="网站模板">模板之家</a>
    <a href="https://www.chazidian.com/" title="查字典">查字典</a>
</div>
</body>
</html>
